<div class="modal-header bg-primary">
    <h3 class="modal-title">{{dialog.title | ellipsis:50}}</h3>
</div>
<div class="modal-body merge-dialog">
    <div class="input-group input-group-lg search-field">
        <span class="input-group-addon">
            <label class="radio-inline">
                <input type="radio" name="search-type" ng-model="dialog.search.type" value="title" ng-change="dialog.onTypeChange('title')"> By Title
            </label>
            <label class="radio-inline">
                <input type="radio" name="search-type" ng-model="dialog.search.type" value="number" ng-change="dialog.onTypeChange('number')"> By Number
            </label>
        </span>
        <input type="{{dialog.search.type === 'number' ? 'number' : 'text'}}"
            placeholder="{{dialog.search.placeholder}}"
            ng-model="dialog.search.input"
            uib-typeahead="caze as dialog.format(caze) for caze in dialog.getCaseList(dialog.search.type, $viewValue)"
            typeahead-wait-ms="500"
            typeahead-min-length="dialog.search.minInputLength"
            typeahead-on-select="dialog.onSelect($item)"
            class="form-control">
    </div>

    <div class="empty-message mv-s" ng-show="dialog.search.cases.length === 0">
        Please search for the case to be merged with: <br>
        <strong>{{dialog.prompt}}</strong>
    </div>
    <div class="mv-s merge-case" ng-repeat="c in dialog.search.cases">
        <div class="alert alert-warning" ng-show="c.mergeInto">
            WARNING: This case has already been merged with another case
        </div>
        <h4>{{c.title}}</h4>
        <div>
            <span>
                <i class="glyphicon glyphicon-user"></i>
                <user-info value="c.assignee" field="name"></user-info>
            </span>
            <span class="ml-xxs">
                <i class="glyphicon glyphicon-calendar"></i>
                <span>{{c.startDate | shortDate}}</span>&nbsp;&nbsp;
            <span ng-show="isCaseClosed()" class="text-success">(Closed at
                    {{c.endDate | shortDate}}
                    as
                    <strong>{{CaseResolutionStatus[c.resolutionStatus]}}</strong>)</span>
            </span>
        </div>
        <div class="mt-xs wrap" ng-if="c.tags.length>0">
            <strong>Tags:</strong>
            <tag-list data="c.tags"></tag-list>
        </div>
        <div class="mt-xs wrap">
            <div marked="c.description" class="markdown"></div>
        </div>
    </div>
</div>
<div class="modal-footer text-left">
    <button class="btn btn-default" ng-click="dialog.cancel()" type="button">Cancel</button>
    <button class="btn btn-primary pull-right" ng-click="dialog.merge()" ng-disabled="dialog.search.cases.length < 1"
        type="button">Merge</button>
</div>
